<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<body>
	<ui:composition template="/pages/protected/user/default.xhtml">
		<ui:define name="content">
			<h3>#{msgs.transactionDetailsHeader}</h3>
			
			<h4><h:outputLabel value="#{msgs.invalidID}" rendered="#{transactionMB.invalidID}" /></h4>
			
			<h:form id="transaction" rendered="#{!transactionMB.invalidID}">
				<h:inputHidden id="app" value="#{transactionMB.transaction.id}" />
				<h:panelGrid columns="2" styleClass="panelGrid"
					rowClasses="panelFirstLine,panelNextLine">
					<h:outputLabel for="date" value="#{msgs.date}" />
					<h:outputLabel id="date"
						value="#{transactionMB.transaction.formattedDate}" />

					<h:outputLabel for="amount" value="#{msgs.amount}" />
					<h:outputLabel id="amount"
						value="#{transactionMB.transaction.amount} HUF" />

					<h:outputLabel for="type" value="#{msgs.type}" />
					<h:outputLabel id="type"
						value="#{msgs[transactionMB.transaction.typeString]} " />
					
					<h:outputLabel for="category" value="#{msgs.category}" />
					<h:outputLabel id="category"
						value="#{transactionMB.transaction.category.name} " />
						
					<h:outputLabel for="note" value="#{msgs.note}" />
					<h:outputLabel id="note"
						value="#{transactionMB.transaction.note} " />
				</h:panelGrid>
				<br />
			</h:form>
			
			<h:form rendered="#{!transactionMB.invalidID}">
				<p:dataTable id="commentList" value="#{commentMB.allCommentsForTransaction}"
					var="comment" styleClass="table" headerClass="tableColumnsHeader">
					<p:column sortBy="#{comment.date}">
						<f:facet name="header">
								#{msgs.date}
							</f:facet>
						#{comment.date}
					</p:column>
					<p:column>
						<f:facet name="header">
								#{msgs.Name}
							</f:facet>
						#{comment.user.name}
					</p:column>
					<p:column sortBy="#{comment.text}">
						<f:facet name="header">
								#{msgs.text}
						</f:facet>
						#{comment.text}
					</p:column>
				</p:dataTable>
			</h:form>
			
			
			<h:form rendered="#{!transactionMB.invalidID}">
			<h3>#{msgs.newComment}</h3>
				<h:inputText id="commentText" value="#{commentMB.comment.text}"
						required="true" requiredMessage="#{msgs.commentTextRequired}" />
				
				<h:inputHidden value="#{transactionMB.transaction.id}" />
				
				<h:commandButton action="#{commentMB.createComment()}" value="#{msgs.create}">
				</h:commandButton>
			</h:form>
			
		</ui:define>
	</ui:composition>
</body>
</html>